<template>
 <div>
   <el-berad></el-berad>
   <el-button type="primary" size="medium" @click="add">添加</el-button>
   <r-list @editRole='editRole'></r-list>
   <r-dialog :dialogInfo='dialogInfo' @cancel='cancel' ref="roleInfo"></r-dialog>
 </div>
</template>

<script>
import rList from './list'
import rDialog from './rDialog'
export default {
 data() {
  return {
    dialogInfo:{
      isShow:false,
      isAdd:true
    }
  }
 },
 components:{
   rList,
   rDialog
 },
 methods:{
   add(){
     this.dialogInfo.isShow = true
     this.dialogInfo.isAdd = true
   },
   cancel(e){
     this.dialogInfo.isShow = e
   },
   editRole(e){
     this.dialogInfo.isShow = true
     this.dialogInfo.isAdd = false
     this.$refs.roleInfo.lookup(e)
   }
 }
}
</script>

<style lang="less" scoped>
  .el-button{
    margin: 20px 0;
  }
</style>
